<template>
  <ul class="my-product">
    <li
      v-for="obj in arr"
      :key="obj.id"
    >
      <span>{{ obj.proname}}</span>
      <span>{{ obj.proprice }}</span>
    </li>
  </ul>
</template>

<script>
import eventBus from '../EventBus'
export default {
  props: ['arr'],
  created () {
    eventBus.$on('send', (index, price) => {
      this.arr[index].proprice -= price
    })
  }
}
</script>

<style>
.my-product {
  width: 400px;
  padding: 20px;
  border: 2px solid #000;
  border-radius: 5px;
  margin: 10px;
}
</style>